import { RouteRecordRaw } from "vue-router";

// 扩展 RouteMeta 接口
declare module "vue-router" {
	interface RouteMeta {
		id: string;
		title?: string;
		isLink?: string;
		isHide?: boolean;
		isKeepAlive?: boolean;
		isAffix?: boolean;
		isIframe?: boolean;
		roles?: string[];
		icon?: string;
	}
}

/**
 * 路由meta对象参数说明
 * meta: {
 *   id:           路由 id，必须唯一（用于动态角色权限控制路由）
 *   title:        菜单栏及 tagsView 栏、菜单搜索名称
 *   isLink:       是否超链接菜单，开启外链条件，`1、isLink: 链接地址不为空 2、isIframe:false`
 *   isHide:       是否隐藏此路由
 *   isKeepAlive:  是否缓存组件状态
 *   isAffix:      是否固定在 tagsView 栏上
 *   isIframe:     是否内嵌窗口，开启条件，`1、isIframe:true 2、isLink：链接地址不为空`
 *   roles:        当前路由的角色权限标识，控制路由显示、隐藏（用于固定角色权限控制路由）
 *   icon:         菜单、tagsView 图标 -> iconfont：`iconfont icon-xxx`；fontawesome：`fa fa-xxx`；element：`ele-Xxx`；
 * }
 */

/**
 * 定义动态路由
 * 前端添加路由，请在顶级节点的 `children 数组` 里添加
 * @description isRequestRoutes 为 false 时使用固定角色权限控制路由，为 true 时使用动态角色权限控制路由
 * @returns 返回路由菜单数据
 */
export const dynamicRoutes: Array<RouteRecordRaw> = [
	{
		path: "/",
		name: "/",
		component: () => import("/@/layout/index.vue"),
		redirect: "/home",
		meta: {
			id: "root",
			isKeepAlive: true,
		},
		children: [
			{
				path: "/home",
				name: "home",
				component: () => import("/@/views/home/index.vue"),
				meta: {
					id: "home",
					title: "首页",
					isLink: "",
					isHide: false,
					isKeepAlive: true,
					isAffix: true,
					isIframe: false,
					roles: ["admin", "common"],
					icon: "fa fa-home",
				},
			},
			{
				path: "/system",
				name: "system",
				component: () => import("/@/layout/routerView/parent.vue"),
				redirect: "/system/user",
				meta: {
					id: "system",
					title: "系统管理",
					isLink: "",
					isHide: false,
					isKeepAlive: true,
					isAffix: false,
					isIframe: false,
					roles: ["admin"],
					icon: "fa fa-server",
				},
				children: [
					{
						path: "/system/role",
						name: "role",
						component: () => import("/@/views/system/role/index.vue"),
						meta: {
							id: "role",
							title: "角色管理",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-street-view",
						},
					},
					{
						path: "/system/user",
						name: "user",
						component: () => import("/@/views/system/user/index.vue"),
						meta: {
							id: "user",
							title: "用户管理",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin"],
							icon: "fa fa-user-circle",
						},
					},
				],
			},
			{
				path: "/iconList",
				name: "iconList",
				component: () => import("/@/layout/routerView/parent.vue"),
				redirect: "/iconList/element-plus",
				meta: {
					id: "iconList",
					title: "图标展示",
					isLink: "",
					isHide: false,
					isKeepAlive: true,
					isAffix: false,
					isIframe: false,
					roles: ["admin", "common"],
					icon: "fa fa-google-wallet",
				},
				children: [
					{
						path: "/iconList/element-plus",
						name: "elementPlusIcons",
						component: () => import("/@/views/iconList/element-plus/index.vue"),
						meta: {
							id: "elementPlusIcons",
							title: "element-plus 图标",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "ele-ShoppingTrolley",
						},
					},
					{
						path: "/iconList/font-awesome",
						name: "fontAwesomeIcons",
						component: () => import("/@/views/iconList/font-awesome/index.vue"),
						meta: {
							id: "fontAwesomeIcons",
							title: "font-awesome 图标",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "ele-ShoppingTrolley",
						},
					},
					{
						path: "/iconList/iconfont",
						name: "iconfontIcons",
						component: () => import("/@/views/iconList/iconfont/index.vue"),
						meta: {
							id: "iconfontIcons",
							title: "iconfont 图标",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "ele-ShoppingTrolley",
						},
					},
				],
			},
			{
				path: "/demo",
				name: "demo",
				component: () => import("/@/layout/routerView/parent.vue"),
				redirect: "/demo/iconSelectorDemo",
				meta: {
					id: "demo",
					title: "组件 Demo",
					isLink: "",
					isHide: false,
					isKeepAlive: true,
					isAffix: false,
					isIframe: false,
					roles: ["admin", "common"],
					icon: "fa fa-hashtag",
				},
				children: [
					{
						path: "/demo/editorDemo",
						name: "editorDemo",
						component: () => import("/@/views/demo/editorDemo/index.vue"),
						meta: {
							id: "editorDemo",
							title: "富文本编辑器",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-pencil",
						},
					},
					{
						path: "/demo/noticeBarDemo",
						name: "noticeBarDemo",
						component: () => import("/@/views/demo/noticeBarDemo/index.vue"),
						meta: {
							id: "noticeBarDemo",
							title: "滚动通知栏",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-bell-o",
						},
					},
					{
						path: "/demo/iconSelectorDemo",
						name: "iconSelectorDemo",
						component: () => import("/@/views/demo/iconSelectorDemo/index.vue"),
						meta: {
							id: "iconSelectorDemo",
							title: "图标选择器",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-credit-card",
						},
					},
					{
						path: "/demo/iconDemo",
						name: "iconDemo",
						component: () => import("/@/views/demo/iconDemo/index.vue"),
						meta: {
							id: "iconDemo",
							title: "图标组件",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-gg",
						},
					},
					{
						path: "/demo/tableDemo",
						name: "tableDemo",
						component: () => import("/@/views/demo/tableDemo/index.vue"),
						meta: {
							id: "tableDemo",
							title: "表格组件",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-table",
						},
					},
					{
						path: "/demo/filterDemo",
						name: "filterDemo",
						component: () => import("/@/views/demo/filterDemo/index.vue"),
						meta: {
							id: "filterDemo",
							title: "过滤筛选组件",
							isLink: "",
							isHide: false,
							isKeepAlive: true,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "fa fa-stack-overflow",
						},
						// 此处详情写法：嵌套进父级里时，面包屑显示：首页/过滤筛选组件/过滤筛选组件详情
						children: [
							{
								path: "/demo/filterDemo/details",
								name: "filterDetails",
								component: () => import("/@/views/demo/filterDemo/details.vue"),
								meta: {
									id: "filterDetails",
									title: "过滤筛选组件详情",
									isLink: "",
									isHide: true,
									isKeepAlive: false,
									isAffix: false,
									isIframe: false,
									roles: ["admin", "common"],
									icon: "ele-Sunny",
								},
							},
						],
					},
					// 此处详情写法：脱离了父级，面包屑显示：首页/过滤筛选组件详情（path中去掉了/filterDemo）
					{
						path: "/demo/details1",
						name: "filterDetails1",
						component: () => import("/@/views/demo/filterDemo/details1.vue"),
						meta: {
							id: "filterDetails1",
							title: "过滤筛选组件详情1",
							isLink: "",
							isHide: true,
							isKeepAlive: false,
							isAffix: false,
							isIframe: false,
							roles: ["admin", "common"],
							icon: "ele-Sunny",
						},
					},
				],
			},
		],
	},
];

/**
 * 定义401、404界面
 * @link 参考：https://next.router.vuejs.org/zh/guide/essentials/history-mode.html#netlify
 */
export const warningRoutes = [
	{
		path: "/401",
		name: "notAuthorized",
		component: () => import("/@/views/error/401.vue"),
		meta: {
			id: "notAuthorized",
			title: "没有权限",
			isHide: true,
		},
	},
	{
		path: "/:path(.*)*",
		name: "notFound",
		component: () => import("/@/views/error/404.vue"),
		meta: {
			id: "notFound",
			title: "找不到此页面",
			isHide: true,
		},
	},
];

/**
 * 定义静态路由（默认路由）
 * 此路由不要动，前端添加路由的话，请在 `dynamicRoutes 数组` 中添加
 * @description 前端控制直接改 dynamicRoutes 中的路由，后端控制不需要修改，请求接口路由数据时，会覆盖 dynamicRoutes 第一个顶级 children 的内容（全屏，不包含 layout 中的路由出口）
 * @returns 返回路由菜单数据
 */
export const staticRoutes: Array<RouteRecordRaw> = [
	{
		path: "/login",
		name: "login",
		component: () => import("/@/views/login/index.vue"),
		meta: {
			id: "login",
			title: "登录",
		},
	},
];
